import { ActionContext } from 'vuex'
import { Theme } from '../interface/theme'
const state: Theme = {
  theme: 'light'
}
const mutations = {
  CHANGE_THEME: (state: Theme, theme: 'dark' | 'light') => {
    state.theme = theme
  }
}
const actions = {
  changeTheme({ commit }: ActionContext<Theme, any>, paylod: Theme) {
    const { theme } = paylod
    localStorage.setItem('pcls-prefer-theme', theme)
    document.documentElement.setAttribute('data-theme', theme)
    commit('CHANGE_THEME', theme)
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
